<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <!--
    表单标签 action表单提交到服务器地址
    -->
    <form action="test.php" method="post">
        <!--明文输入框
        -->
        用户：<input type="text">
        <!--暗文输入框
        br 强制换行-->
        密码：<input type="password"><br>
        <!--单选按钮-->
        性别：
        <label for="list"> 男：</label>
        <input type="radio" name="gender" value="male" id="list">
        <label>
            女：<input type="radio" name="gender" value="female" id="">
        </label> <br>
        爱好：
        篮球： <input type="checkbox" name="hobbies" value="basketball">
        足球：<input type="checkbox" name="hobbies" value="football">
        游泳：<input type="checkbox" name="hobbies" value="swimming"><br>
        <!--下拉框-->
        <select name="city">
            <!--下拉选项-->
            <!--给下拉选项分组-->
            <optgroup label="一线城市">
                <option value="lanzhou">兰州</option>
                <option value="tianshui">天水</option>
                <option value="baiyin">白银</option>
            </optgroup>
            <optgroup label="二线城市">
                <option value="shanghai">上海</option>
                <option value="beijing">北京</option>
                <option value="guangzhou">广州</option>
            </optgroup>
        </select><br>
        <!--多行文本框 -->
        <textarea></textarea>
        <!--进度条-->
        <progress value="70" max="100"></progress>
        <!--滑块-->
        <input type="range" min="0" step="1" max="10">
        <!--时间日期选择器-->
        <input type="datetime-local">
        <!--日期选择器-->
        <input type="date">
        <!--颜色拾取器-->
        <input type="color">
        <!--普通按钮-->
        <input type="button" value="提交">
    </form>
</body>

</html>